<template>
	<scroll-view scroll-y="true" :style="{height: pageHeight - 60 + 'px'}">
		<view class="flex-row user-top-dom">
			<image v-if="userData.avatarUrl" style="width: 80px; height: 80px;  border-radius: 4px;" :src="userData.avatarUrl"></image>
			<image v-else-if="userData.gender == 1" style="width: 80px; height: 80px;  border-radius: 4px;" src="@/static/images/user-avatar1.png"></image>
			<image v-else style="width: 80px; height: 80px;  border-radius: 4px;" src="@/static/images/user-avatar2.png"></image>
			<view class="user-top-dom-r">
				<view class="title">{{userData.name}}</view>
				<view>{{userData.nickname}} </view>
				<view>{{userData.basicPhoneNumber}}</view>
			</view>
		</view>
		<view class="tab-dom">
			<uni-card>
				<view class="flex-row flex-row-space-between ">
					<navigator url="/pages/student/recruit/my-recruit" hover-class="none">
						<view class="tab-item">
							<view>
								<image class="image" src="@/static/images/icons-zuji.png"
									style="width: 40px; height: 40px;">
								</image>
							</view>
							<view>应聘足迹</view>
						</view>
					</navigator>
					<navigator url="/pages/student/activity/my-activity" hover-class="none">
						<view class="tab-item">
							<view>
								<image class="image" src="@/static/images/icons-hudong.png"
									style="width: 40px; height: 40px;">
								</image>
							</view>
							<view>我的活动</view>
						</view>
					</navigator>
					<navigator url="/pages/student/consult/my-consult" hover-class="none">
						<view class="tab-item">
							<view>
								<image class="image" src="@/static/images/icons-yuyu.png"
									style="width: 40px; height: 40px;">
								</image>
							</view>
							<view>我的咨询</view>
						</view>
					</navigator>
				</view>
			</uni-card>
		</view>
		<view class="p10" style="padding-top: 65px;">
			<uni-list>
				<uni-list-item title="基本信息" to="/pages/student/user/information/index" link>
					<template v-slot:footer><text class="iconfont icon-jibenxinxi1"
							style="color: #9896f1;"></text></template>
				</uni-list-item>
				<uni-list-item title="修改基本信息" to="/pages/student/user/information/edit" link>
					<template v-slot:footer><text class="iconfont icon-xiugaimima"
							style="color: #ff7500;"></text></template>
				</uni-list-item>
				<!-- #ifdef MP-WEIXIN -->
				<uni-list-item title="消息推送开关" to="/pages/student/user/correlation-wx" link>
					<template v-slot:footer><text class="iconfont icon-xinxituisong"
							style="color: #008aff;"></text></template>
				</uni-list-item>
				<!-- #endif -->
				<!-- <uni-list-item title="学籍信息" to="/pages/student/user/school-register" link>
					<template v-slot:footer><text class="iconfont icon-xuejixinxi"
							style="color: #00c1de;"></text></template>
				</uni-list-item> -->
				<uni-list-item title="我的证书" rightText="&#xe73c;" to="/pages/student/user/certificate/list" link>
					<template v-slot:footer><text class="iconfont icon-zhengshu"
							style="color: #1fab89;"></text></template>
				</uni-list-item>
				<uni-list-item title="学业成绩" to="/pages/student/user/grade/list" link>
					<template v-slot:footer><text class="iconfont icon-zonghepingjia"
							style="color: #fd5959;"></text></template>
				</uni-list-item>
				<uni-list-item title="校内活动" rightText="&#xe73c;" to="/pages/student/user/school-activities/list" link>
					<template v-slot:footer><text class="iconfont icon-liwuhuodong" style="color: #f08a5d;"></text></template>
				</uni-list-item>
				<uni-list-item title="校外活动" rightText="&#xe73c;" to="/pages/student/user/school-after-activities/list" link>
					<template v-slot:footer><text class="iconfont icon-huodongyingxiao"
							style="color: #95e1d3;"></text></template>
				</uni-list-item>
				<uni-list-item title="参建项目" rightText="&#xe73c;" to="/pages/student/user/project/list" link>
					<template v-slot:footer><text class="iconfont icon-xiangmu"
							style="color: #00b8a9;"></text></template>
				</uni-list-item>
			</uni-list>
		</view>

		<view class="p10">
			<uni-list>
				<uni-list-item title="预览个人信息" rightText="&#xe61c;" :to="'/pages/preview/index?userId=' + userData.userId + '&id=' + userData.id" link>
					<template v-slot:footer><text class="iconfont icon-yulan" style="color: #d89fff;"></text></template>
				</uni-list-item>
				<uni-list-item title="我的二维码" rightText="&#xe63a;" to="/pages/student/user/code" link>
					<template v-slot:footer><text class="iconfont icon-erweima-copy"
							style="color: #a89fff;"></text></template>
				</uni-list-item>
			</uni-list>
		</view>
		<button @click="logOut" type="default" style="margin: 10px 15px;" class="basicbutton " hover-class="basicbutton-hover">退出</button>
	</scroll-view>
</template>

<script lang="ts" setup>
	import { getUser } from "@/utils/storage"
	import { User } from "@/api/tables/User"
	import { ref } from 'vue'
	import { onShow } from '@dcloudio/uni-app'
	let pageHeight = ref(90)
	let userData = ref<User>({})
	onShow(() => {
		// 获取当前窗口高度
		pageHeight.value = uni.getSystemInfoSync().windowHeight
		// 监听窗口大小的变化
		uni.onWindowResize((res) => {
			pageHeight.value = res.size.windowHeight
		})
		userData.value = getUser()
	})
	function logOut() {
		uni.redirectTo({
			url: '/pages/login/login'
		});
	}
</script>

<style lang="scss" scoped>
	.user-top-dom {
		background: #01c2b7;
		padding: 20px 20px 40px;
		height: 100px;

		.user-top-dom-r {
			padding: 0 20px;
			font-size: 22rpx;
			line-height: 2;
			color: #fff;

			.title {
				font-size: 28rpx;
				font-weight: 600;
				color: #fff;
			}

		}
	}

	.tab-dom {
		position: absolute;
		width: 100%;
		top: 110px;

		.tab-item {
			text-align: center;
			flex: 1
		}
	}
</style>